
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ul,ol{
    list-style: none;
}
a{
    text-decoration: none;
}
img {
    display: block;
}
body,html {
    height: 100%;
}
body {
    background-color: #efefef;
}
input {
    border:none;
    outline:none;
}
@function pr($num){
   @return  $num/37.5 +rem;
}
.entirety{
    width: 100%;
    .main {
        // 头部
        .header {
            height: pr(50);
            background: #ff841d;
            border-bottom: pr(1) solid #ccc;
            display: flex;
            justify-content: space-between;
            .left {
                padding: pr(12);
                a {
                    img {
                        height: pr(25);
                    }
                }
            }
            .right {
                padding: pr(7);
                a {
                    img {
                        height: pr(34);
                    }
                }
            }
        } // 搜索
        .search {
            height: pr(50);
            border-bottom: pr(1) solid #ccc;
            display: flex;
            justify-content: space-between;
            padding: pr(10);
            background-color: #fff;
            .searchtext {
                width: 90%;
                height: pr(30);
                border-radius: pr(15);
                border: none;
                background-color: #f1f1f1;
                padding-left: pr(20);
                font-size: pr(16);
                margin-bottom: 0;
                margin-right: pr(-30);
            }
            .searchbtn {
                width: pr(63);
                height: pr(30);
                background: #ff841d;
                border-radius: pr(15);
                border: none;
                font-size: pr(17);
                color: white;
            }
        } // 分类
        .classify {
            display: flex;
            flex-wrap: wrap;
            background-color: #fff;
            li {
                width: 25%;
                transition: all 1s;
                &:nth-child(9),
                &:nth-child(10),
                &:nth-child(11),
                &:nth-child(12) {
                    display: none;
                }
                a {
                    width: 100%;
                    padding: pr(10);
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    img {
                        width: pr(50);
                        height: pr(50);
                    }
                    .text {
                        font-size: pr(16);
                        margin: 0;
                        margin-top: pr(5);
                    }
                }
            }
            li.show {
                display: block;
            }
        } // 折扣推荐
        .recommend {
            background-color: #fff;
            .top {
                display: flex;
                justify-content: space-between; // align-items: center;
                background-color: #ff9000;
                height: pr(35);
                padding: pr(7) pr(10);
                p {
                    color: #fff;
                    font-size: pr(18);
                    font-weight: 700;
                }
                img {
                    height: 100%;
                }
            }
            .bottom {
                li {
                    border-bottom: pr(1) solid #ccc;
                    a {
                        display: flex;
                        justify-content: space-between;
                        padding: pr(20);
                        .left {
                            flex-basis: pr(100);
                            img {
                                width: 100%;
                            }
                        }
                        .right {
                            flex: 1;
                            margin-left: pr(20);
                            display: flex;
                            flex-direction: column;
                            justify-content: space-between;
                            .text {
                                color: #333333;
                                font-size: pr(15);
                                .price {
                                    color: #ff6c00;
                                }
                            }
                            .other {
                                color: #a1a1a1;
                                font-size: pr(12);
                                display: flex;
                                justify-content: space-between;
                                .info {
                                    display: flex;
                                    img {
                                        margin-right: pr(5);
                                    }
                                }
                            }
                        }
                    }
                }
            }
        } // 更多优惠
        .more_bar {
            background-color: #efefef;
            text-align: center;
            padding: pr(10); // 更多优惠
            .moreinfo {
                display: inline-block;
                width: 100%;
                background: linear-gradient(#ffffff, #f4f4f4);
                height: pr(30);
                line-height: pr(30);
                border: pr(1) solid #ddd;
                border-radius: pr(4);
                color: #5a5a5a;
                font-size: pr(14);
            }
        } // 品牌排行
        .brand {
            width: 100%;
            height: pr(35);
            line-height: pr(35);
            margin: pr(10) pr(0) pr(6);
            background: linear-gradient(#ffaf47, #ff9000);
            a {
                display: inline-block;
                width: 100%;
                color: #fff;
                font-size: pr(18); // font-weight: 700;
                padding-left: pr(10);
            }
        } // 底部
        .footer {
            margin-top: pr(10);
            .top {
                display: flex; // justify-content: space-around;
                align-items: center;
                border-top: pr(1) solid #c4c4c4;
                border-bottom: pr(1) solid #c4c4c4;
                height: pr(34);
                line-height: pr(34);
                a {
                    width: 33.3333333333333%;
                    height: 100%;
                    text-align: center;
                    color: #5a5a5a;
                    font-size: pr(14);
                    &.totop {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        img {
                            width: pr(15);
                            height: pr(15);
                            margin-right: pr(2);
                            margin-bottom: pr(3);
                        }
                    }
                    &:nth-child(2) {
                        border-left: pr(1) solid #c4c4c4;
                        border-right: pr(1) solid #c4c4c4;
                    }
                }
            }
            .bottom {
                height: pr(60);
                padding: pr(15) pr(0);
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                align-items: center;
                a {
                    color: #5a5a5a;
                    font-size: pr(12);
                    margin: 0;
                    margin-right: pr(3);
                }
                .txt {
                    display: flex;
                    justify-content: center;
                    .mobile {
                        color: red;
                    }
                }
            }
        }
    }
       // 固定部分
    .fixedcontent {  
        .appshow {
            position:fixed;        
            z-index:999;                 
            right: 0px;
            bottom: 60px;
            img {
                width: 64px;
            }
        }
        .fixtotop {
            position:fixed;        
            z-index:999;
            right: 10px;
            bottom: 10px;
           span {
            background-color: rgba(255,255,255,.85);
            width: 44px;
            height: 44px;
            line-height: 44px;
            border-radius: 50%;
            border: 1px solid #ddd;
            font-size: 30px;
            text-align: center;
            color:#666;
           }
            
        }
    }
}